<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>园区分布</title>
<link rel="stylesheet" href="${path }/res/css/common.css">
<link rel="stylesheet" href="${path }/res/css/index.css">
<link href="${path}/res/js/ztree/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
<link href="${path}/res/js/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<link href="${path}/res/js/ligerUI/skins/Blue/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<link href="${path}/res/js/ligerUI/skins/ligerui-icons.css" rel="stylesheet" type="text/css" />
<link href="${path}/res/js/jNotify/jNotify.jquery.css" rel="stylesheet" type="text/css" />
<script src="${path}/res/js/jquery-1.12.4.min.js" type="text/javascript"></script>
<script src="${path}/res/js/jquery-migrate-1.4.1.js" type="text/javascript"></script>
<script src="${path}/res/js/jquery.nicescroll.min.js" type="text/javascript"></script>
<script src="${path}/res/js/artDialog/jquery.artDialog.js?skin=blue" type="text/javascript"></script>
<script src="${path}/res/js/artDialog/iframeTools.js" type="text/javascript"></script>
<script src="${path}/res/js/ztree/jquery.ztree.all-3.5.min.js" type="text/javascript"></script>
<script src="${path}/res/js/jNotify/jNotify.jquery.js" type="text/javascript"></script>
<script src="${path}/res/js/ui.util.js" type="text/javascript"></script>
<script src="${path}/res/js/myutils.js" type="text/javascript"></script>
<script src="${path}/res/js/mywidgets.js" type="text/javascript"></script>
<script src="${path}/res/js/UiFunc.js" type="text/javascript"></script>

<script src="${path}/res/js/ligerUI/js/ligerui.min.js" type="text/javascript"></script>
<script src="${path}/res/js/ligerUI/js/ligerAccordion2.js" type="text/javascript"></script>
<script src="${path}/res/js/ligerUI/js/ligerLayout3.js" type="text/javascript"></script>
<script type="text/javascript">
var ui3;
$(function (){
	ui3 = window.systemUiLayout3 = $("#indexlayout").ligerLayout3({
		topOffset: 100,
		leftWidth: 280,
		moduleContainerId: 'indexmodule',
		basepath: '${path}',
		filepath: '${path}/files',
		respath: '${path}/res',
		iconpath: '${path}/res/icon',
		defaultPageSize: '20',
		getModulesUrl: '${path}/ui/getModules.json',
		getLeftTabsUrl: '${path}/ui/getLeftTabs.json',
		getLeftDataUrl: '${path}/ui/getLeftData.json',
		getCenterTabsUrl: '${path}/ui/getCenterTabs.json',
		getCenterDataUrl: '${path}/ui/getCenterData.json',
		defaultIcon: '${path}/res/img/noimg.jpg',
		errorIcon: '${path}/res/img/noimg.jpg',
		onSelect:onselect,
		onClose: function(){ $('#layoutOutter').hide(); }
	});
	
	loadModules($('#modlist'), $('#layoutOutter'));
	
	$("#mycenter").click(function(){
		var cfg = {"code":"mycenter"};
		$('#layoutOutter').show();
		if(ui3.curModule != cfg.code){
			ui3.curModule = cfg.code;
			ui3.loadModuleUI(cfg);
		}
		return false;
	});
	
	$("#logout").click(function(){
		artConfirm("退出登录", "<b>您确定要退出登录吗？</b>", function(){
			location.href = "${path}/sys/logout.do";
		});
	});
	
	$(window).resize(function(){
		_resize();
		_resize();
	});
	_resize();
});
//加载模块信息
function loadModules(moduleContainer, layoutContainer){
	moduleContainer.empty();
	$.get('${path}/ui/getModules.json', function(modules){
		
		for(var i=0; i<modules.length; i++){
			var cfg = modules[i];
			var html = '<li id="module_'+cfg.id+'" class="moduleitem">'
				+'<div class="icon"><img src="${path}/res/icon/'+cfg.icon+'" alt="'+cfg.name+'" /></div>'
				+'<p>'+cfg.name+'</p>'
				+'</li>';
			var mod = $(html);
			moduleContainer.append(mod);
			mod.attr('title', (cfg.remark||cfg.name));
			mod.data('_moduleIndex', i);
			mod.data('_moduleCfg', cfg);
		}
		moduleContainer.append('<div style="clear:both;"></div>');
		
		var moduleitems = $(".moduleitem", moduleContainer);
		moduleitems.click(function(){
			var mod = $(this);
			var cfg = mod.data('_moduleCfg');
			moduleitems.removeClass('moduleitem-current');
			mod.removeClass("moduleitem-hover");
			mod.addClass('moduleitem-current');
			//加载布局配置
			layoutContainer.show();
			if(ui3.curModule != cfg.code){
				ui3.curModule = cfg.code;
				ui3.loadModuleUI(cfg);
			}
		});
		moduleitems.hover(function()
		{
			if(!$(this).hasClass("moduleitem-current"))
			{
				$(this).addClass("moduleitem-hover");
			}
		},function ()
		{
			$(this).removeClass("moduleitem-hover");
		});
	});
}
function _resize(){
	$('#wraplist').height($(window).height()-100);
}
</script>
</head>
<body style="margin:0;padding:0;overflow:hidden;">
<!--头部-->
<header class="header">
    <div class="bg">
        <div class="logo"></div>
        <div class="geren">
            <span>
                <img src="${path}/res/img/admin.png" />
                <span>${loginUser.login_name }</span>
            </span>
            <span>
                <img src="${path}/res/img/geren.png" id="mycenter" style="cursor:pointer;" />
            </span>
            <span>
                <img src="${path}/res/img/tuichu.png" id="logout" style="cursor:pointer;" />
            </span>
        </div>
    </div>
</header>
<section>
    <div class="wrap">
        <div class="list" id="wraplist">
            <ul id="modlist" class="modlist">
            </ul>
        </div>
        <div class="footer">
            Copyright © 2017 - 2018 QingXin. All Rights Reserved
        </div>
    </div>
</section>

<div id="layoutOutter" class="index-body layout-outter">
<div id="indexlayout">
	<div position="left" id="frameleft" title="菜单"></div>
	<div position="ctabs" id="frametabs" title="功能" align="center"></div>
	<div position="center" id="framecenter" title="首页" style="overflow:auto;">
		<div id="loading" class='l-layout-loading'></div>
        <iframe frameborder="0" name="mainiframe" id="mainiframe" src="about:blank" class="l-layout-mainiframe"></iframe>
        <div id="maincontainer" class="l-layout-maincontainer"></div>
        <iframe frameborder="0" name="formiframe" id="formiframe" src="about:blank" class="l-layout-mainiframe l-layout-formiframe" style="z-index:100"></iframe>
	</div>
	<div position="right" id="frameright" title="信息"></div>
</div>
</div>

</body>
</html>